<%@ page contentType="text/html;charset=UTF-8" %>
<%@include file="/WEB-INF/jsp/common/taglibs.jspf"%>
<es:contentHeader title="资源列表" style="no-skin" >
    <%@include file="/WEB-INF/jsp/common/import-zTree-css.jspf"%>
</es:contentHeader>

<div class="main-container ace-save-state" id="main-container">
    <script type="text/javascript">try{ace.settings.loadState('main-container')}catch(e){}</script>
    <div class="main-content">
        <div class="main-content-inner">
            <div class="page-content">
                <div class="row no-margin-left">
                    <div class="col-xs-12">
                        <div class="row no-margin-left">
                            <div class="col-sm-3">
                                <ul class="nav nav-tabs">
                                    <li ${empty param['search.show_eq'] ? 'class="active"' : ''}>
                                        <a href="javascript:loadTree(true);">
                                            <i class="icon-table"></i> 所有
                                            <i class="icon-refresh" title="点击刷新"></i>
                                        </a>
                                    </li>
                                    <li ${not empty param['search.show_eq'] ? 'class="active"' : ''}>
                                        <a href="javascript:loadTree(true, {'search.show_eq': true});">
                                            <i class="icon-table"></i> 显示的
                                        </a>
                                    </li>
                                </ul>
                                <div id="resourceTree" class="ztree"></div>
                            </div>
                            <div class="col-sm-9">
                                <iframe id="listFrame" style="display:none" frameborder="0" scrolling="auto"></iframe>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<es:contentFooter>
    <%@include file="/WEB-INF/jsp/common/import-zTree-js.jspf"%>
    <script type="text/javascript">

        function resizeFrame($target) {
            var $win = $(window), $parent = $target.parent();
            $target.css({
                width: $win.width() - $parent.offset().left,
                height: $win.height()
            })
        }

        function loadTree(async, params) {
            $.getJSON('/admin/sys/resource/ajax/tree', $.extend({
                async: true
            }, params), function (list) {
                var zNodes = [];
                if (list && list.length > 0) {
                    list.forEach(function(item){
                        zNodes.push({
                            id: item.id,
                            pId: item.pId,
                            name: item.name,
                            iconSkin: item.iconSkin,
                            open: true,
                            root: item.root,
                            isParent: item.isParent
                        });
                    })
                }

                $.zTree.initMovableTree({
                    treeId: 'resourceTree',
                    loadUrl: '/admin/sys/resource/ajax/tree',
                    urlPrefix : "${ctx}/admin/sys/resource",
                    async : async,
                    onlyDisplayShow: params && params['search.show_eq'],
                    permission: <es:treePermission resourceIdentity="sys:resource"/>,
                    autocomplete : {enable : true},
                    setting : {
                        callback : {
                            onClick: function(event, treeId, treeNode) {
                                var $frame = $('#listFrame').hide();
                                $frame.attr('src', '${ctx}/admin/sys/resource/' + treeNode.id + "/update?async=" + async);
                                resizeFrame($frame);
                                $frame.show();
                            }
                        }
                    }
                });
            });
        }

        loadTree(true);
    </script>
</es:contentFooter>

